import React from 'react';
import {Form, Select, Input, Row, Col, DatePicker, Button, Modal, Table, Collapse} from 'antd'
import ManagerBody from '../../components/ManagerBody';
import { FetchAPI } from '../../utils/fetch-middleware'

const Panel = Collapse.Panel;
import { setTitle} from '../../common/PublicComponent';
//RCS_NEW_MANAGER_MERCHAT

@setTitle('账务管理-主交易码处理','API_GET_TCD_MODELS')
@Form.create()
export default class TcdList extends React.Component {

    componentWillMount() {
    }
    serachData = (para) => {
        const formData = this.props.form.getFieldsValue();
        const {pageNum,pageSize} = para;

        FetchAPI(`/api/acc/queryMain?pageNum=${pageNum}&pageSize=${pageSize}`,'POST',formData).then((result)=>{
            debugger;
            const {total, current, size} = result;
            this.setState({total: total, pageNum: current, pageSize: size})
        },(err)=>{
            debugger;
        });
    }

    handleSubmit = (e) => {
        const { pageSize,} = this.state;
        this.setState({pageNum:1})
        const params = {
            pageNum:1,
            pageSize,
        }
        this.serachData(params);
    }
    componentDidMount(){
        /** 初始化数据 */
        this.handleSubmit();
    }

    showAddModal = () => {
        // this.initData()
        this.setState({
            visible: true,
        });
    }

    render() {

        const {tcdListData =[]} = this.props;
        const {getFieldDecorator} = this.props.form;
        const layout = {
            xs: 24,
            sm: 12,
            md: 6,
        }
        const customPanelStyle = {
            // background: '#f7f7f7',
            borderRadius: 4,
            marginBottom: 24,
            border: 0,
            overflow: 'hidden',
        };
        return (

            <div>
                <Form  style={{margin: 'auto', marginTop: 20}} className="container">
                    <Collapse bordered={false}>
                        <Panel header="查询" style={customPanelStyle}>
                            <Row style={{paddingTop: 30}}>
                                <Col {...layout}>
                                    <Form.Item
                                        label="主交易码"
                                        labelCol={{span: 10}}
                                        wrapperCol={{span: 14}}
                                    >
                                        {getFieldDecorator('tcd',{
                                                initialValue:''
                                            }
                                        )(
                                            <Input style={{width: 140}}/>
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col {...layout} style={{float: 'right', textAlign: 'end', marginRight: '2%', marginBottom: 20}}>
                                     <Button type="primary" onClick={() => {
                                        this.handleSubmit()
                                    }} style={{width: 118}}>查询</Button>
                                </Col>
                            </Row>
                        </Panel>
                    </Collapse>
                </Form>
                <Button className="addBtn" onClick={this.showAddModal} type="primary" ghost>添加主交易码</Button>
                <ManagerBody columns={this.columns}
                             dataSource={tcdListData}
                             pageNum={this.state.pageNum}
                             pageSize={this.state.pageSize}
                             total={this.state.total}
                             changeSize={(v) => {
                                 this.setState({pageSize: v})
                             }}
                             changePage={(v) => {
                                 this.setState({pageNum: v})
                             }}
                             serachData={this.serachData}
                             expandedRowRender={record => <p style={{ margin: 0 }}>1111</p>}
                ></ManagerBody>
            </div>
        );
    }

    state = {
        pageNum: 1,
        pageSize: 10,
        total: 10,
        startHitTime: '',
        endHitTime:'',
        visible: false,
    }
    columns = [{
        title: '主交易码',
        dataIndex: 'tcd',
        key: 'tcd',
    }, {
        title: '交易名称',
        dataIndex: 'tcdName',
        key: 'tcdName',
    }, {
        title: '状态',
        dataIndex: 'status',
        key: 'status',
    }, {
        title: '正反交易',
        dataIndex: 'transDrt',
        key: 'transDrt',
    }, {
        title: '冻结金额类型',
        dataIndex: 'blkAmtFlag',
        key: 'blkAmtFlag',
    }, {
        title: '是否批量解冻',
        dataIndex: 'batBlkFlag',
        key: 'batBlkFlag',
    }, {
        title: '交易类型',
        dataIndex: 'tdType',
        key: 'tdType',
    }, {
        title: '交易分类',
        dataIndex: 'transType',
        key: 'transType',
    }]
}